<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Themes</title>
    <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <link rel="stylesheet" href="css/style.css">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
</head>
<body>

<nav class="navbar navbar-light mb-5">
    <div class="container">
        <a class="navbar-brand">Themes</a>
        <ul class="nav justify-content-end">
            <li class="nav-item">
                <a class="nav-link" href="#">Themes</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">About</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="#">FAQ</a>
            </li>
        </ul>
    </div>
</nav>

<div class="banner">
    <div class="container container-one mb-5">
        <div class="row">
            <div class="col-md col-12">
                <img src="images/banner_03.gif" alt="" class="mb-2">
                <h2>Themes</h2>
                <p>Customize and extend</p>
                <a href="#" class="btn">Explore</a>
            </div>
        </div>
    </div>
    <div class="container container-two">
        <div class="row">
            <div class="col-md-4">
                <img src="images/bannner-one_07.gif" alt="" class="mb-3">
                <h6>Components and esamples</h6>
                <p>Each theme features new components</p>
            </div>
            <div class="col-md-4">
                <img src="images/banner-two_09.gif" alt="" class="mb-3">
                <h6>Tons of variables</h6>
                <p>Themes components inherit much</p>
            </div>
            <div class="col-md-4">
                <img src="images/banner-three_07.gif" alt="" class="mb-3">
                <h6>Source files and tools</h6>
                <p>Each theme incudes components</p>
            </div>
        </div>
    </div>
</div>

<main>
    <div class="container container-one mb-5">
        <h3 class="wz mb-4 mt-4">Team</h3>
      <div class="row">
          <div class="col-md-4 mt-3">
              <div class="card" style="">
                  <img src="images/insta-2.jpg" class="card-img-top" alt="...">
                  <img src="images/avatar-fat.jpg" alt="" class="card-img-buttom">
                  <div class="card-body mt-5">
                      <h5 class="card-title">Jacob Thornton</h5>
                      <p class="card-text">Creator of Bootstrap, engineer at Twitter & Medium. Founder of BBumpers.</p>
                      <a href="#" class="btn btn-primary  mb-2">View GitHub</a>
                  </div>
              </div>
          </div>
          <div class="col-md-4  mt-3">
              <div class="card" style="">
                  <img src="images/insta-1.jpg" class="card-img-top" alt="...">
                  <img src="images/avatar-mdo.jpg" alt="" class="card-img-buttom">
                  <div class="card-body mt-5">
                      <h5 class="card-title">Mark Otto</h5>
                      <p class="card-text">Design at Giteator of Bootstrap. Previously at twitter. Huge nerd.</p>
                      <a href="#" class="btn btn-primary  mb-2">View GitHub</a>
                  </div>
              </div>
          </div>
          <div class="col-md-4  mt-3">
              <div class="card" style="">
                  <img src="images/insta-3.jpg" class="card-img-top" alt="...">
                  <img src="images/avatar-dhg.png" alt="" class="card-img-buttom">
                  <div class="card-body mt-5">
                      <h5 class="card-title">Dave Gamache</h5>
                      <p class="card-text">Dessign at Twitter & Medium Starting something new soon:)</p>
                      <a href="#" class="btn btn-primary mb-2">View GitHub</a>
                  </div>
              </div>
          </div>
      </div>
    </div>
    <div class="container container-two mb-5">
        <div class="row">
            <div class="col-md-6">
                <h6>C'mon,check out the themes!</h6>
                <p>Now you know what we're about,so peep the goods!</p>
            </div>
            <div class="col-md-6">
                <a href="#" class="btn">Explore</a>
            </div>
        </div>
    </div>
</main>

<footer>
    <div class="container mb-5">
                <ul class="nav justify-content-center">
                    <li class="nav-item">
                        <a class="nav-link" href="#">About</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">Terms</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">Privacy</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">licenses</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">FAQ</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">Bootstrap</a>
                    </li>
                </ul>
        </div>
</footer>

<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.slim.min.js"></script>
<script src="https://cdn.bootcss.com/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>

</body>
</html>